Writing Alt Text and Long Descriptions
TLC Guide
Alt text and long descriptions are both used to make images accessible to students who use screen readers, but they serve different purposes. This guide focuses on what to include, how to format descriptions, and strategies for working efficiently when remediating images.
For a brief explanation of how alt text and long descriptions differ, see Alt Text vs. Long Descriptions: What’s the Difference?
Note: This guide may be updated over time as we continue learning what best supports students who use screen readers, particularly in the context of biology.
Table of Contents
- What Content to Include
- Formatting for Screen Readers
- Working Efficiently
- Alt Text and Long Descriptions Across All Platforms
- Additional Resources
What Content to Include
What’s “important” in an image depends on how students are expected to use it. Always write descriptions with the learning task in mind.
Common examples of relevant information include:
- Graphs: shape of the line, type of graph, several orienting points, minimum and maximum values of axes, units of axes, where the peak is for a normal curve, etc.
- Cellular diagrams: orientation to the inside and outside of the cell, protein channels and ions that move through them, step-by-step description of processes like signal transduction or mRNA transcription, etc.
- Ecological figures: description of how organisms are connected in a food web, overview of a landscape followed by a description of the component organisms, etc.
- Experimental set-ups: different treatment and control groups, duration of time, genotype or phenotype of organism, behaviors exhibited by experiment subject, etc
For multipart images, use clear labels such as “Option A,” “Option B,” or “Step 1,” “Step 2.”
A helpful rule of thumb:
- Alt text answers “What is this?”
- A long description answers “What do I need to know about this to succeed?”
Content to Handle Carefully
Some content may seem important to people who don’t use screenreaders, but is distracting or not relevant to people who do use them.
- Color: Only include color when its necessary to convey meaning. If color is critical for understanding, explain what the color represents. For example, a surface that is glowing red to indicate that it is hot could be described as “a red-hot surface”.
- Positions: Avoid describing layout unless spatial relationships are a fundamental part of the relationship between visual items. If poisition is ciritical for understanding, descripe the relationship.
Formatting for Screen Readers
The format of the text can affect how a screen reader verbalizes text. Think about how you would speak the content out loud to help make the most appropriate formatting choice for your context. Here are some guidelines to help you create alt text and long descriptions that a screen reader can verbalize correctly:
- Spell out numbers and dates (e.g., “twenty” instead of “20”)
- Spell acronyms with spaces if they should be read letter by letter (e.g., “A T P” would be read correctly as as “aye tee pee”, while “ATP” will be read as “ahtp”)
- Words that are spelled the same but pronounced differently can be tricky for screen readers (e.g., the word "read" can be pronouced as "reed" or "red"). Different screen readers have different capacities for selecting the correct pronunciation, so familiarize yourself with the platform(s) your students might use. In the absence of an obvious solution, always provide context for words with multiple pronunciations.
- Use punctuation intentionally to control pauses. Most screen readers will pause for commas, periods, semicolons, question marks, exclamation points, and paragraph endings.
- Avoid ambiguous hyphen use by spelling out meaning when clarity matters.
- “Four minus two equals two”
- “Event goes from ten to eleven A M”
- “A charge of negative two”
Some of the aboveformatting guidelines could be very distracting to students who do not use screen readers. Keep in mind which pages of your course are designed exclusively for screen reader users and which pages will be accessed by all students, and adapt these formatting guidelines based on your audience.
Working Efficiently
Creating accessible images can feel overwhelming. These strategies can help:
Review images first
- Are these the images you want to keep using?
- Is the complexity appropriate for this course level?
- Are they legible and colorblind accessible?
- Would recreating them (e.g., in BioRender) improve clarity?
Leverage TA support
Depending on course structure, TAs may be able to help draft descriptions. This can be a meaningful professional development opportunity, especially for TAs interested in teaching. Undergraduate ATAs or student workers may also assist through accessibility-focused training pathways.
Use AI tools to get you started
ASU’s AI-powered Image Accessibility Generator can help you create a first draft of alt text and long descriptions. The output from this tool should always be reviewed by a subject matter expert to ensure that the description is accurate, suitable for the course level, and (in the case of assessments) describes the content relevant to the question. The generator will produce a slightly different output each time, so we recommend running the generator at least twice per image.
Note: The AI generator may produce descriptions that are too long for alt text and may not account for how screen readers interpret punctuation or symbols.
Alt Text and Long Descriptions Across All Platforms
General options
Most platforms currently have integrated ways for editors to input alt text. Microsoft Office 360, Google Worskspace, the Adobe Suite have tutorials for adding alt text to images. If an integrated method for adding alt text is not available, consider adding a description of the image to the main body text of your content or integrating it as an image caption or figure legend.
Long descriptions can be more challenging to add, as most platforms do not have an integrated way to do so. However, long descriptions can be added as an image caption or figure legend.
Canvas
Adding alt text in Canvas files ensures that alt text is added to anywhere that image appears in the course.
Canvas currently does not support long descriptions, but TLC has developed a workaround to support students.
- Create a page in Canvas titled “Long Description [Image file name]”
- Add the long description you have written to the page.
- Link this page beneath the the image in your course.
Quizzes
The above method is not compatible with quizzes or exams that use proctoring software, as students are not able to open new tabs without being flagged. If you have images in your proctored quizzes and exams, try following TLC’s guide on Canvas Exams and Screenreaders.
Additional Resources
- ASU IT Accessibility: Accessible images: alternative text guidelines
- ASU IT Accessibility: Procedural Guidelines
- ASU IT Accessibility: Accessible online courses
- WebAIM: Designing for Screen Reader Compatibility
- Web Accessibility Initiative: Use Clear, Unambiguous Formatting and Punctuation